<template>
  <div class="all"><br>
    <h3>&emsp;修改密码</h3><br>
    <div class="pas-box"><img src="../../assets/svgs/user.svg">
      <el-input size="large" placeholder="请输入手机号"></el-input>
    </div>
    <div class="pas-box"><img src="../../assets/svgs/dun.svg">
      <el-input size="large" placeholder="请输入手机号验证码"></el-input>
      <el-button class="b1" size="large" type="primary">获取验证码</el-button>
    </div>
    <div class="pas-box"><img src="../../assets/svgs/key.svg">
      <el-input size="large" placeholder="请输入新密码"></el-input>
    </div>
    <div class="pas-box"><img src="../../assets/svgs/key.svg">
      <el-input size="large" placeholder="请确认密码"></el-input>
    </div>
    <el-button class="b2" @click="updatePassword" type="primary">确定</el-button>
  </div>
</template>


<script>

import axios from 'axios';

export default {
  name: "UpdatePassword",
  components: {

  },
  data() {
    return {
      tel: "",
      telCode: "",
      password: "",
      newPassword: "",
    }
  },
  methods: {
    updatePassword() {
      axios.post(`Login`, {
        tel: this.tel, telCode: this.telCode, password: this.password, newPassword:
        this.newPassword
      })
          .then(function (response) {
            console.info(response)
          })
          .catch(function (error) {
            console.info(error)
          })
    }
  }
}
</script>

<style scoped>
* {
  margin: 0;
  padding: 0;
}

.all {

  height: 450px;


}

.all .pas-box {
  width: 90%;
  height: 50px;

  margin-left: 20px;
  margin-bottom: 20px;
  border-radius: 10px;
position: relative;
}
/deep/
.el-input__inner{
  text-indent: 30px;
}
.all .pas-box img {
  width: 20px;
 position: absolute;
z-index: 1000;
  top: 10px;
  left: 10px;
}

.all .pas-box .i1 {
  width: 60%;
  height: 50px;
  border: none;
  outline: none;
  float: left;
  line-height: 50px;
  font-size: 20px;

}

.b1 {

  position: absolute;
  z-index: 1000;
  right: 0px;
}

.b2 {
  width: 15%;
  height: 10%;
  border-radius: 10px;
  margin-left: 20px;
  font-size: 16px;
}
</style>